<template>
	<view>
		<table>
			<tr>
				<td>
					标题:
				</td>
				<td>
					<input type="text" value="" v-model="title" placeholder="请输入标题"/>
				</td>
			</tr>
			<tr>
				<td>内容:</td>
				<td><input type="text" value="" v-model="Data" placeholder="请填写内容"/></td>
			</tr>
			<tr>
				<td>
					分类:
				</td>
				<td>
					<picker mode="selector" :range="Types" range-key="Data" @change="changetype">
						<view>{{type.Data||'请选择'}}</view>
					</picker>
				</td>
			</tr>
		</table>
		<button type="default" @click="add()">添加</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Types:[],
				type:"",
				title:"",
				Data:"",
			}
		},
		onLoad() {
			this.list()
		},
		methods: {
			list(){
				uni.request({
				    url: 'http://127.0.0.1:8080/type/list', //仅为示例，并非真实接口地址。
				    data: {
				    },
				    header: {
				        'custom-header': 'hello' //自定义请求头信息
				    },
				    success: (res) => {
				        console.log(res.data);
						this.Types = res.data.Data
				    }
				});
			},
			changetype(e){
				console.log(e)
				const index = e.detail.value
				this.type=this.Types[index]
			},
			add(){
				uni.request({
				    url: 'http://127.0.0.1:8080/add', //仅为示例，并非真实接口地址。
					method:"POST",
				    data: {
						title:this.title,
						data:this.Data,
						type:this.type.ID,
				    },
				    header: {
				        'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
				    },
				    success: (res) => {
				        console.log(res.data);
						uni.reLaunch({
							url: '/pages/index/index'
						});
				    }
				});
			},
		}
	}
</script>

<style>

</style>
